/*
 * zScroll 2.0
 * Author by zfb 2016
 * 封装了滑动切换(slide)效果和渐变切换(fade)效果,支持手势切换
*/
/* ===============================================================
Basic scroll Styles
================================================================*/
.wrapper li {
    position: relative;
    float: left;
}
.pagination {position:absolute;left:0;bottom:0;overflow:hidden;text-align:center;width:100%;line-height:100%;}
.pagination div {width:10px;height:10px;background-color:#fff;margin:2px;border-radius:10px;box-shadow: 0px 1px 2px #555 inset}
.pagination div.selected {background-color:#999;box-shadow: 0px 1px 2px #444 inset;}
.pagination div.selected_visible {background-color:#ccc;box-shadow: 0px 1px 2px #444 inset;}
.preClass,.nextClass {width:15px;height:30px;background-color:#ccc;}
.preClass {
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAA8CAYAAACAX1ESAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBRDA2MUVFQTQxMkMxMUUyQUM0NDhBQzJEMDk2QTM3NiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBRDA2MUVFQjQxMkMxMUUyQUM0NDhBQzJEMDk2QTM3NiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkFEMDYxRUU4NDEyQzExRTJBQzQ0OEFDMkQwOTZBMzc2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkFEMDYxRUU5NDEyQzExRTJBQzQ0OEFDMkQwOTZBMzc2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+UiC77QAAAVVJREFUeNqk18GKwjAQBuDWs6eFQB9pocc+juAz+GB7UEHwtG/gzYuHpTuzm0gIzWT+P4EfTEs/Qh0zcVzXdSDHXvLUDzsSmCRfkuPfTFcCZpLc1v9xl+x7gFucD90AglQBL2ICHiS0gBbiAizEDdSQEgit99YNlAgF5Ig+cGWAhOgD3yyQkHMEHgyQkEXyE6ETi2g+JS8Wyic0VF6goK2LMFS7AUHWTTfUWqoL8ry4JuT9Gk0IKaoqhJb4JsR0wByaWSRBhzQfs1PBu8ujI50KjrHLT9QZQbt67O6u9mDVyYT0GatOaAhu3t6yhyHvcSKwW4EbQg84gd0Kmj3aWwsmhFRmFUJ/vTl0TRCzDeSQnibCSP5BCJK75ENyYTelU1yJniaWHuAVd7ihG0CRTQBBqoAXMQEP0gRaiAuwEDdQQyBgC4GBEqGAHJlZoFzJgQE0vwIMAJIJkQRla4XTAAAAAElFTkSuQmCC") no-repeat left top;
  width: 17px;
  height: 30px;
  z-index:10;
  left:0;
}
.nextClass {
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAA8CAYAAACAX1ESAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBRDA2MUVFQTQxMkMxMUUyQUM0NDhBQzJEMDk2QTM3NiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBRDA2MUVFQjQxMkMxMUUyQUM0NDhBQzJEMDk2QTM3NiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkFEMDYxRUU4NDEyQzExRTJBQzQ0OEFDMkQwOTZBMzc2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkFEMDYxRUU5NDEyQzExRTJBQzQ0OEFDMkQwOTZBMzc2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+UiC77QAAAVVJREFUeNqk18GKwjAQBuDWs6eFQB9pocc+juAz+GB7UEHwtG/gzYuHpTuzm0gIzWT+P4EfTEs/Qh0zcVzXdSDHXvLUDzsSmCRfkuPfTFcCZpLc1v9xl+x7gFucD90AglQBL2ICHiS0gBbiAizEDdSQEgit99YNlAgF5Ig+cGWAhOgD3yyQkHMEHgyQkEXyE6ETi2g+JS8Wyic0VF6goK2LMFS7AUHWTTfUWqoL8ry4JuT9Gk0IKaoqhJb4JsR0wByaWSRBhzQfs1PBu8ujI50KjrHLT9QZQbt67O6u9mDVyYT0GatOaAhu3t6yhyHvcSKwW4EbQg84gd0Kmj3aWwsmhFRmFUJ/vTl0TRCzDeSQnibCSP5BCJK75ENyYTelU1yJniaWHuAVd7ihG0CRTQBBqoAXMQEP0gRaiAuwEDdQQyBgC4GBEqGAHJlZoFzJgQE0vwIMAJIJkQRla4XTAAAAAElFTkSuQmCC") no-repeat left bottom;
  width: 17px;
  height: 30px;
  z-index:10;
  right:0;
}
.preClass,.nextClass {cursor:pointer;}
.title {
	position:absolute;
	left:0;bottom:0;
	width:100%;
	background-color:#666;
	background-color:rgba(50,50,50,.4);
	text-align:center;
}
.title a,.title a:visited {
    display:block;
    line-height:1.45;
    color:#fff;
    padding:.4em 10px;
}
<!--ecms sync check [sync_thread_id="3bcee7cc5a424330844ab778a62d31c1" sync_date="2018-06-22 13:06:47" check_sum="3bcee7cc5a424330844ab778a62d31c1]-->